/*
 * @Description:
 * @Author: anqing.liang
 * @Date: 2021-07-20 10:06:02
 * @LastEditTime: 2021-08-13 15:55:58
 * @LastEditors: anqing.liang
 */
import React, { Component } from 'react';
import {
    Table,
} from 'hzero-ui';

interface IProps {
    columns: Array<object>;
    tableProps?: object;
    dataSource: Array<Array<object>>;
    style?: React.CSSProperties;
}
interface IState {
    current: number;
    currentData: Array<object>;
}
export default class DisplayTable extends Component<IProps, IState>{
    constructor(props) {
        super(props);
        this.state = {
            current: 1,//当前页数
            currentData: [],//当前页数据
        }
    }
    componentDidMount() {
        this.setState({ currentData: this.props.dataSource[0] })
    }
    itemRender(current, type) {
        if (type === 'prev') {
            return <a>Prev</a>;
        } if (type === 'next') {
            return <a>Next</a>;
        }
        return current;
    }

    onPageChange = (page) => {
        this.setState({ current: page, currentData: this.props.dataSource[page - 1] })
    }
    get tableProps(): object {
        return this.props.tableProps || {};
    }

    render() {
        const dataSource: Array<object> = this.props.dataSource || [];
        const paginationProps = {
            itemRender: this.itemRender,
            onChange: this.onPageChange,
            total: 10 * dataSource.length,
        }
        const currentData = this.state.currentData || dataSource[0];
        return (
            <React.Fragment>
                <div style={this.props.style}>
                    <Table
                        columns={this.props.columns}
                        dataSource={currentData}
                        pagination={paginationProps}
                        {...this.tableProps}
                    />
                </div>
            </React.Fragment>
        )
    }
}
